/*** 

====================================================================
	Main Header style / Header Style One
====================================================================

***/

.main-header{
	position: relative;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	z-index: 9999;
	background:none;
}



/*** 

====================================================================
		Banner Section
====================================================================

***/

.banner-section{
	position: relative;
	z-index:1;
}


.showcase {
	height: 90vh;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: #fff;
	padding: 0 0px; margin-top:0px
}


.video-container {
	position: absolute;
	top: 100px;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: var(--primary-color) url('../img/cover.jpg') no-repeat center
		center/cover;
}


.banner_bot{ width:100%;height:100px}





@media screen and (max-width: 1440px) {
 .showcase {
height:87vh;margin-top:0px
}

}


@media screen and (max-width: 1024px) {
 .showcase {
height:485px;
}

}
 @media screen and (max-width: 768px) {
 .showcase {
height:364px;
}
.video-container {top: 60px;}
.banner_bot{ width:100%;height:60px}

}
 @media screen and (max-width: 414px) {
 .showcase {
height:196px;
}

}
 @media screen and (max-width: 375px) {
 .showcase {
height:178px;
}

}
 @media screen and (max-width: 360px) {
 .showcase {
height:171px;
}

}













.showcase h1{font-weight:bold;}
.showcase .content{opacity: 0.7;}
.video-container video {
	min-width: 100%;
	min-height: 100%;
  position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}

.video-container:after {
	content: '';
	z-index: 1;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.1);
	position: absolute;
}

.content {
	z-index: 2;
	
}